<template>
    <div>
        <com-filterTable
            ref="filterTable"
            title="网点查询"
            class="py-16 px-16"
            services="queryOutletsInfo"
            :filter-form-config="formConfig"
            :filterInline="false"
            :params="{}"
            :filterCol="4"
            filterLabelWidth="90px"
            :table-border="true"
            :showFormFilter="true"
            :showRequestNum="false"
            :top-operation="topOperation"
            :table-column="columnConfig"
            :queryDataHandle="queryDataHandle"
            :beforeSearch="beforeSearch"
            :autoLoad="false"
            :pagination="false"
        />
        <com-formDialog
            ref="dialog"
            v-bind="dialogData"
            @cancel="dialogCancelHandle"
            @submit="submitHandle"
        />
        <com-dialog
            ref="comDialog"
            :title="dialogData.title"
            :width="dialogData.width"
            :height="dialogData.height"
        >
            <div slot="body"></div>
        </com-dialog>
    </div>
</template>

<script>
import _ from "lodash";
import service from "@service";
// pageSize
// pageNo
const siteMap = {
    1: '服务网点',
    2: '应用网点'
}
const booleanMap = {
    1: '是',
    0: '否'
}
const weekMap = {
    1: '周一',
    2: '周二',
    3: '周三',
    4: '周四',
    5: '周五',
    6: '周六',
    7: '周日',

}
export default {
    name: "SiteSearch",
    data() {
        return {
            dialogData: {},
            batchSelected: [],
            columnConfig: [
                { type: "select" },
                { value: "type", label: "网点类型", type: 'render', render: (h, {data: {row}}) => {
                    return <span>{siteMap[row.type]}</span>
                } },
                { value: "branch_name", label: "网点名称" },
                { value: "address", label: "详细地址" },
                // { value: "key4", label: "营业时间" },
                {
                    value: "action",
                    label: "操作",
                    type: "render",
                    render: (h, { data: { row } }) => {
                        const detailClick = async () => {
                            let loading = await this.$store.dispatch('global/loading');
                            let result = await service('queryOutletsDetailInfo', {
                                data: {
                                    branchId: row.branchId
                                }
                            }).finally(e => {
                                return loading.close();
                            });

                            if(!result) {
                                return;
                            }
                            
                            this.dialogData = {
                                title: "详情",
                                configs: this.dialogFormConfigs,
                                initFormData: result.data,
                                needConfirmSign: false,
                                col: 2,
                                width: "1000px",
                                height: '550px',
                                slotRenders: {
                                    footer: (h) => {
                                        return null;
                                    },
                                },
                            };
                            this.$refs.dialog.show();
                        };
                        return (
                            <span
                                class="blue-text-button"
                                on-click={detailClick}
                            >
                                详情
                            </span>
                        );
                    },
                },
            ],
            formConfig: [
                {
                    key: "branchName",
                    label: "网点名称",
                },
                {
                    key: "address",
                    label: "网点地址",
                    // required: true,
                },
                {
                    key: "business_name",
                    label: "业务名称",
                    placeholder: '多个以 , 分割'
                },
                // {
                //     key: "key1",
                //     label: "网点类型",
                //     type: "select",
                //     options: [{ value: "1", label: "类型一" }],
                // },
                // {
                //     key: "key2",
                //     label: "营业状态",
                //     type: "select",
                //     options: [{ value: "1", label: "类型一" }],
                // },
                // {
                //     key: "key3",
                //     label: "下层类型",
                //     type: "select",
                //     options: [{ value: "1", label: "类型一" }],
                // },
                // {
                //     key: "key4",
                //     label: "所在城市",
                //     type: "select",
                //     options: [{ value: "1", label: "类型一" }],
                // },
                // {
                //     key: "key5",
                //     label: "上层类型",
                //     type: "select",
                //     options: [{ value: "1", label: "类型一" }],
                // },
                // {
                //     key: "key6",
                //     label: "所在地区",
                //     type: "select",
                //     options: [{ value: "1", label: "类型一" }],
                // },
                // {
                //     key: "key7",
                //     label: "受理业务",
                //     type: "select",
                //     options: [{ value: "1", label: "储值卡" }],
                // },
                // {
                //     key: "key8",
                //     label: "关键词",
                // },
            ],
            topOperation: {},
        };
    },
    watch: {},
    computed: {
        provCode() {
            return this.$store.state.global.provCode;
        },
        staffId() {
            return _.get(this.$store.state.account, "accountObject.staffId");
        },
        dialogFormConfigs() {
            const configs = [
                { key: "branchId", label: "网点编码", type: "string" }, // Integer
                { key: "branch_name", label: "网点名称", type: "string" }, // String
                { key: "city_name", label: "城市名称", type: "string" }, // String
                { key: "area_name", label: "区域名称", type: "string" }, // String
                { key: "is_open", label: "是否对外", type: "render", render: (h,_, __, data) => {
                    return <span>{booleanMap[data]}</span>
                } }, // Integer
                { key: "address", label: "地址", type: "string" }, // String
                { key: "tel", label: "电话", type: "string" }, // String
                { key: "fax", label: "传真", type: "string" }, // String
                // {key: 'latitude', label: '纬度', type: 'string'    }, // String
                // {key: 'longitude', label: '经度', type: 'string'    }, // String
                // {key: 'mapLabel', label: '坐标', type: 'string'    }, // String
                { key: "sbranch_type", label: "网点上层编号", type: "string" }, // Integer
                { key: "Cname", label: "营业状态", type: "string" }, // String
                {
                    key: "bran_type_name",
                    label: "网点类型名称",
                    type: "string",
                }, // String
                { key: "type", label: "网点类型", type: "render", render: (h, vm,itme,data) => {
                    return <span>{siteMap[data]}</span>
                }}, // ",notes = "1，服务网点；2，应用网点 Integer
                { key: "fname", label: "上层类型名称", type: "string" }, // String
                { key: "num", label: "评价人数", type: "string" }, // Integer
                { key: "assCore", label: "评价分数（平均分）", type: "string" }, // Integer
                {
                    key: "branchTimeList",
                    label: "营业时间",
                    type: "render",
                    fullLine: true,
                    render: (h, vm, item, value) => {
                        return (
                            <com-table
                                ref="table"
                                table-column={[
                                    { value: "branch_id", label: "网点编号" },
                                    {
                                        value: "start_week",
                                        label: "开始时间(日)",
                                        type: 'render',
                                        render: (h, {data: {row}}) => {
                                            return <span>{weekMap[row.start_week]}</span>
                                        }
                                    },
                                    {
                                        value: "end_week",
                                        label: "截止时间(日)",
                                        type: 'render',
                                        render: (h, {data: {row}}) => {
                                            return <span>{weekMap[row.end_week]}</span>
                                        }
                                    },
                                    { value: "bs_time", label: "营业时间" },
                                ]}
                                import-data={value}
                                auto-load={false}
                                pagination={false}
                            />
                        );
                    },
                },
                {
                    key: "businessList",
                    label: "服务业务",
                    type: "render",
                    fullLine: true,
                    render: (h, vm, item, value) => {
                        return (
                            <com-table
                                ref="table"
                                table-column={[
                                    { value: "id", label: "业务id" },
                                    { value: "name", label: "业务名称" },
                                ]}
                                import-data={value}
                                auto-load={false}
                                pagination={false}
                            />
                        );
                    },
                },
            ];
            return configs;
        },
    },
    // mounted() {
    //     this.$nextTick(() => {
    //         if (this.staffId) {
    //             this.loadList();
    //         }
    //     });
    // },
    methods: {
        queryDataHandle(params) {
            let temp = {
                ...params,
                page: {pageNo: 1, pageSize: 20}
            };
            return temp;
        },
        beforeSearch(data) {
            if(!data.branchName && !data.address) {
                this.$message.warning('网点名称和网点地址不能同时为空！');
                return 
            }
            return true;
        },
        loadList() {
            this.$refs.filterTable.filterFormQueryHandle();
        },
        dialogCancelHandle() {
            this.$refs.dialog.close();
        },
        async submitHandle(data) {
            let handle = this[this.dialogData.submitHandle];
            if (handle) {
                let loading = await this.$store.dispatch("global/loading");
                let result = await handle(data).catch((e) => {
                    loading.close();
                });
                loading.close();
                this.$refs.dialog.close();
                this.loadList();
            }
        },
    },
};
</script>
